<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="gb2312">
<title>Column 三栏布局</title>
<meta name="Keywords" content="" >
<meta name="Description" content="" >
<link href="css/styles.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="js/modernizr.js"></script>
<![endif]-->
<script src="js/jquery-1.4.4.min.js"></script>
<script src="js/main.js"></script>
</head>
<body>
<header>
<a href="/" id="logo"><img src="images/logo.png" alt=""/><h1>Column</h1></a>
 <div id="wrap-menu">                    
   <ul id="header-menu">
     <li><a href="/">网站首页</a></li>
     <li><a href="/">个人档案</a>
        <ul class="second-lvl">
           <li><a href="/">关于我</a></li>
           <li><a href="/">我的相册</a></li>
           <li><a href="/">我的作品</a></li>                      
         </ul>   
      </li>
      <li><a href="/">个人博客</a></li>
      <li><a href="/">技术探讨</a>
         <ul class="second-lvl">
           <li><a href="/">PHP</a></li>
           <li><a href="/">ASP</a></li>
           <li><a href="/">Div+css</a>
               <ul class="third-lvl">
                  <li><a href="/">html5</a></li>
                  <li><a href="/">css</a></li>                       
                </ul>       
            </li>
           </ul>                             
        </li>
        <li><a href="/">给我留言</a></li>
        <li><a href="/">友情链接</a></li>
    </ul>
</div>            
</header>
<div id="container">
   <div class="banner">
     <img src="images/banner1.jpg">
   </div>
</div>
<div class="motto">
 <p>有时候不是我不理你，其实我也想你了，只是我不知道该对你说什么。不管过去如何，过去的已经过去，最好的总在未来等着你。当我们懂得珍惜平凡的幸福的时候，就已经成了人生的赢家。<b>Nothing is as sweet as you</b> 再没什么，能甜蜜如你。我以为只要很认真的喜欢就能打动一个人，到后来，却只打动了我自己。</p>
  <ul class="inbar">
    <li><img src="images/01.jpg"></li>
    <li><img src="images/02.jpg"></li>
    <li><img src="images/03.jpg"></li>
  </ul>
</div>
<div id="container2">
 <ul class="template">
    <section>
     <h2>Powerfull</h2>
     <img src="images/01.jpg">
     <p>
有时候不是我不理你，其实我也想你了，只是我不知道该对你说什么。不管过去如何，过去的已经过去，最好的总在未来等着你。当我们懂得珍惜平凡的幸福的时候，就已经成了人生的赢家。Nothing is as sweet as you 再没什么，能甜蜜如你。我以为只要很认真的喜欢就能打动一个人，到后来，却只打动了我自己。
     </p>
     <h4><a href="/"><b>阅读</b><span>更多>></span></a></h4>
    </section>
     <section>
     <h2>Powerfull</h2>
     <img src="images/02.jpg">
     <p>
有时候不是我不理你，其实我也想你了，只是我不知道该对你说什么。不管过去如何，过去的已经过去，最好的总在未来等着你。当我们懂得珍惜平凡的幸福的时候，就已经成了人生的赢家。Nothing is as sweet as you 再没什么，能甜蜜如你。我以为只要很认真的喜欢就能打动一个人，到后来，却只打动了我自己。
     </p>
     <h4><a href="/"><b>阅读</b><span>更多>></span></a></h4>
    </section>
        <section>
     <h2>Powerfull</h2>
     <img src="images/03.jpg">
     <p>
有时候不是我不理你，其实我也想你了，只是我不知道该对你说什么。不管过去如何，过去的已经过去，最好的总在未来等着你。当我们懂得珍惜平凡的幸福的时候，就已经成了人生的赢家。Nothing is as sweet as you 再没什么，能甜蜜如你。我以为只要很认真的喜欢就能打动一个人，到后来，却只打动了我自己。
     </p>
    <h4><a href="/"><b>阅读</b><span>更多>></span></a></h4>
    </section>
 </ul>
</div>
<div class="idea">
 <p>
当我们懂得珍惜平凡的幸福的时候，就已经成了人生的赢家。Nothing is as sweet as you 再没什么，能甜蜜如你。我以为只要很认真的喜欢就能打动一个人，到后来，却只打动了我自己。
 </p>
</div>
<footer>
 <div class="footer-mid">
    <section class="visitors">
      <h2>最近访客</h2>
      <ul>
       <li><a href="/"><img src="images/01.jpg"></a></li>
       <li><a href="/"><img src="images/02.jpg"></a></li>
       <li><a href="/"><img src="images/03.jpg"></a></li>
       <li><a href="/"><img src="images/04.jpg"></a></li>
       <li><a href="/"><img src="images/02.jpg"></a></li>
       <li><a href="/"><img src="images/03.jpg"></a></li>
       <li><a href="/"><img src="images/04.jpg"></a></li>
       <li><a href="/"><img src="images/03.jpg"></a></li>
       <li><a href="/"><img src="images/04.jpg"></a></li>
      </ul>
    </section>
      <section class="links">
      <h2>合作伙伴</h2>
      <ul>
       <li><a href="/">杨青个人博客网站</a></li>
       <li><a href="/">百度</a></li>
       <li><a href="/">Google</a></li>
       <li><a href="/">Sina</a></li>
       <li><a href="/">3dst 技术服务中心</a></li>
       <li><a href="/">3dst web</a></li>
      </ul>
    </section>
     <section class="links">
      <h2>友情链接</h2>
      <ul>
       <li><a href="/">杨青个人博客网站</a></li>
       <li><a href="/">百度</a></li>
       <li><a href="/">3dst 技术服务中心</a></li>
       <li><a href="/">3dst web</a></li>
      </ul>
    </section>
    <section class="contact">
      <h2>留言</h2>
      <form id="footer-form" method="post" action="">
        <input type="text" onfocus="if(this.value=='Name')this.value='';" onblur="if(this.value=='')this.value='Name';" value="Name" name="field1footer" class="footer-input" >
         <input type="text" onfocus="if(this.value=='Email')this.value='';" onblur="if(this.value=='')this.value='Email';" value="Email" class="footer-input">
         <textarea class="footer-textarea" name="field3footer" id="field3footer"></textarea>
         <input type="submit" id="submit" value="Send" name="submit">                
          </form>
    </section>
 </div>
<div id="footer-bottom"><ul><p>Copyright 2011 - 2014 design by <a href="/">dancesmile</a></p></ul></div>
</footer>
</body>
</html>